<template>
  <el-form :inline="true" :model="form" class="an-form-inline">
    <el-form-item label="订单编号">
      <el-input v-model="form.number" placeholder="输入订单编号" clearable></el-input>
    </el-form-item>
    <el-form-item label="收件人手机号">
      <el-input v-model="form.phone" placeholder="输入手机号" clearable></el-input>
    </el-form-item>
    <el-form-item label="时间筛选">
      <el-date-picker
        v-model="form.time"
        type="daterange"
        range-separator="至"
        start-placeholder="开始日期"
        end-placeholder="结束日期"
      ></el-date-picker>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="submit">查询</el-button>
    </el-form-item>
  </el-form>
</template>

<script lang="ts">
import { Options, Vue } from "vue-class-component";

@Options({
  emits: ["callBack"],
})
export default class order extends Vue {
  [x: string]: any;
  data() {
    return {
      form: {
        number: "",
        phone: "",
        time: [],
      },
    };
  }

  submit() {
    let nd = Object.assign({}, this.form);
    if (nd.time) {
      nd.time = nd.time.map((element: string) => {
        return (element = this.AUTH.changeTime("yyyy-MM-dd", element));
      });
    }
    this.$emit("callBack", nd);
  }
}
</script>